<template>
  <!-- 导航栏 -->
  <navbarback></navbarback>
  <view class="viewpoint">
    <scroll-view scroll-y>
      <view class="addVisit-wrapper">
        <view class="addVisit-firstrow">
          <view class="addVisit-firstrow-box">
            <text class="name-tag">姓名：</text>
            <text class="addVisit-text">{{ infoform.name }}</text>
          </view>
          <view class="addVisit-firstrow-box">
            <text class="name-tag">性别：</text>
            <text class="addVisit-text">{{ infoform.sex }}</text>
          </view>
          <view class="addVisit-firstrow-box">
            <text class="name-tag">年龄：</text>
            <text class="addVisit-text">{{ infoform.age }}岁</text>
          </view>
          <view class="addVisit-firstrow-box">
            <text class="name-tag addVisit-active">体检日期：</text>
            <text class="addVisit-text">{{ Time }}</text>
          </view>
        </view>
        <view class="addVisit-crowdName-box">
          <text class="name-tag">人群分类：</text>
          <text class="addVisit-crowdName-item">{{ infoform.disease }}</text>
        </view>
        <uni-forms ref="formRef" :rules="addVisitRules" :modelValue="addVisitFrom">
          <view class="h-text">体征</view>
          <view class="addVisit-thridrow">
            <view class="addVisit-thridrow-box">
              <uni-forms-item name="bloodPressure" class="forms-error"
                ><text class="name-tag addVisit-active">血压：</text>
                <input
                  class="addvisit-input"
                  v-model="addVisitFrom.bloodPressure"
                  type="number"
                  placeholder="收缩压/舒张压"
                />
                <text class="name-tag">mmHg</text>
              </uni-forms-item>
            </view>
            <view class="addVisit-thridrow-box">
              <uni-forms-item name="pulseRate" class="forms-error"
                ><text class="name-tag addVisit-active">脉率：</text>
                <input v-model="addVisitFrom.pulseRate" class="addvisit-input" type="number" />
                <text class="name-tag">次/分钟</text>
              </uni-forms-item>
            </view>
            <view class="addVisit-thridrow-box">
              <uni-forms-item name="height" class="forms-error">
                <text class="name-tag addVisit-active">身高：</text>
                <input v-model="addVisitFrom.height" class="addvisit-input" type="number" />
                <text class="name-tag">cm</text>
              </uni-forms-item>
            </view>
            <view class="addVisit-thridrow-box">
              <uni-forms-item name="weight" class="forms-error">
                <text class="name-tag addVisit-active">体重：</text>
                <input v-model="addVisitFrom.weight" class="addvisit-input" type="number" />
                <text class="name-tag">kg</text>
              </uni-forms-item>
            </view>
            <view class="addVisit-thridrow-box">
              <uni-forms-item name="temperature" class="forms-error">
                <text class="name-tag addVisit-active">体温：</text>
                <input v-model="addVisitFrom.temperature" class="addvisit-input" type="number" />
                <text class="name-tag">摄氏度</text></uni-forms-item
              >
            </view>
            <view class="addVisit-thridrow-box">
              <uni-forms-item name="bloodGlucose" class="forms-error">
                <text class="name-tag addVisit-active">血糖：</text>
                <input v-model="addVisitFrom.bloodGlucose" class="addvisit-input" type="number" />
                <text class="name-tag">mg/dL</text>
              </uni-forms-item>
            </view>
            <view class="addVisit-thridrow-box">
              <uni-forms-item name="result" class="forms-error"
                ><text class="name-tag addVisit-active">体检结果/备注：</text>
                <input
                  style="width: 200rpx"
                  v-model="addVisitFrom.result"
                  class="addvisit-input"
                  type="text"
                />
              </uni-forms-item>
            </view>
          </view>
        </uni-forms>
      </view>
      <view @tap="addVisit" class="addcheck"
        ><text
          style="
            color: #fff;
            font-weight: bold;
            font-size: 16rpx;
            padding: 5rpx 10rpx;
            background-color: #1ab1ff;
            border-radius: 5rpx;
          "
          >确认添加</text
        ></view
      >
    </scroll-view>
  </view>
</template>

<script setup lang="ts">
import { ref, defineProps, defineEmits } from 'vue'
import navbarback from '@/component/navbarback2.vue'
import { useMemberStore } from '../../stores/index'
import { formatTime } from '@/utils/time'
import { addPetientCheck } from '@/services/check'
const query = defineProps<{ params: any }>()
const infoform = ref()
infoform.value = JSON.parse(query.params)
const MemberStore = useMemberStore()
const Time = formatTime(new Date())
//随访表单
const addVisitFrom = ref({
  patientId: infoform.value.id, //患者id
  doctor_id: MemberStore.profile.doctorInfo.id, //医生id
  healthTime: Time, //体检时间
  result: '', //体检结果
  bloodPressure: '', //血压
  pulseRate: '', //脉率
  height: '', //身高
  weight: '', //体重
  temperature: '', //体温
  bloodGlucose: '', //血糖
})

//校验规则
const formRef = ref<UniHelper.UniFormsInstance>()
const addVisitRules: UniHelper.UniFormsRules = {
  bloodPressure: {
    rules: [{ required: true, errorMessage: '请输入血压' }],
  },
  pulseRate: {
    rules: [{ required: true, errorMessage: '请输入脉率' }],
  },
  height: {
    rules: [{ required: true, errorMessage: '请输入身高' }],
  },
  weight: {
    rules: [{ required: true, errorMessage: '请输入体重' }],
  },
  temperature: {
    rules: [{ required: true, errorMessage: '请输入体温' }],
  },
  bloodGlucose: {
    rules: [{ required: true, errorMessage: '请输入血糖' }],
  },
  drugUsage: {
    rules: [{ required: true, errorMessage: '请输入用药情况' }],
  },
  livingHabit: {
    rules: [{ required: true, errorMessage: '请输入生活情况' }],
  },
  remark: {
    rules: [{ required: true, errorMessage: '请输入随访备注' }],
  },
  result: {
    rules: [{ required: true, errorMessage: '请输入体检结果' }],
  },
}

//提交表单
const addVisit = async (visitSign: number) => {
  try {
    await formRef.value?.validate?.()
    const res = await addPetientCheck(addVisitFrom.value)
    if (res.code == 200) {
      uni.showToast({ icon: 'none', title: '添加成功' })

      let pages = getCurrentPages() // 获取当前页面栈
      let previousPage = pages[pages.length - 1] // 获取返回的页面


      uni.navigateBack()
    }
  } catch (error) {
    console.log(error)
  }
}

//获取患者症状列表
const getCrowdList = () => {}
</script>

<style lang="scss">
page {
  height: 100%;
  background-color: #f4f4f4;
}
.viewpoint {
  display: flex;
  flex-direction: column;
  height: calc(100vh - 50rpx);
  padding: 10rpx 15rpx;
  width: 100%;
  .addcheck {
    text-align: center;
  }
  ::v-deep .uni-forms-item__content {
    display: flex;
  }
  .addVisit-container {
    background-color: #f4f4f4;
    height: calc(100vh - 55rpx);
    padding: 5rpx 10rpx;
    .addVisit-wrapper {
      padding: 10rpx;
      background-color: #fff !important;
      border-radius: 5rpx;
      border: 1rpx solid #f4f4f4;
    }
  }
  .addVisit-firstrow {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    .addVisit-firstrow-box {
      font-size: 12rpx;
      .addVisit-text {
        color: #61666d;
      }
    }
  }

  .addVisit-secondrow {
    font-size: 12rpx;
    display: flex;
    flex-wrap: wrap;
    .checkbox-item {
      margin-right: 18rpx;
      margin-bottom: 10rpx;
    }
  }

  .addVisit-thridrow {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    .addVisit-thridrow-box {
      font-size: 12rpx;
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 14rpx;
      margin-right: 19rpx;
      position: relative;
      .addVisit-text {
        color: #61666d;
      }
    }
  }

  .addVisit-frouthrow {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    .addVisit-frouthrow-box {
      font-size: 12rpx;
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 14rpx;
      margin-right: 19rpx;
      position: relative;
      .addVisit-text {
        color: #61666d;
      }
    }
  }

  .addVisit-active {
    color: #02abf3 !important;
  }

  .h-text {
    padding: 14rpx 0;
    font-size: 15rpx;
    color: #02abf3;
    font-weight: bold;
  }

  .addvisit-input {
    width: 90rpx;
    height: 22rpx;
    background-color: transparent;
    border: 0.5rpx solid #61666d;
    border-radius: 2rpx;
    padding: 0rpx 10rpx;
    margin-right: 5rpx;
  }
  .addVisit-crowdName-box {
    margin-top: 15rpx;
    font-size: 12rpx;
    .addVisit-crowdName-item {
      margin-right: 10rpx;
      background-color: transparent;
      border: 0.5rpx solid #61666d;
      border-radius: 2rpx;
      padding: 4rpx 10rpx;
      color: #61666d;
    }
  }

  .visit-way {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    border: 0.5rpx solid #61666d;
    border-radius: 2rpx;
    height: 20rpx;
    width: 60rpx;
    .visit-way-text {
      text-align: center;
      flex: 1;
    }
    .visit-way-after {
      width: 12rpx;
      height: 100%;
      background-color: #02abf3;
    }
  }
  .visit-way-list {
    position: absolute;
    top: 21rpx;
    right: 0rpx;
    width: 60rpx;
    height: 44rpx;
    padding: 2rpx 0;
    text-align: center;
    border-radius: 2rpx;
    background-color: #f4f4f4;
    .visit-way-item {
      height: 20rpx;
      display: flex;
      justify-content: center;
      align-items: center;
    }
  }
  .visit-way-item-active {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 20rpx;
    color: #fff;
    background-color: #06d9f5;
    background: #fff radial-gradient(#06dbf5, #02abf3);
    border-radius: 5rpx;
  }
}
</style>